<template>
  <div class="create sub-margin">
    <!-- <div class="sub-page-title">民主测评</div> -->
    <div class="content">
      <evaluation-search :task-status="statusOptions" @search="onSearch" @task="onTask"></evaluation-search>
      <div class="table-con">
        <div class="left-con">
          <evaluation-list
            :list="evaluations"
            :total="totalSize"
            :task-status="statusOptions"
            @select="onSelectEva"
            @change="onPageChange"></evaluation-list>
        </div>
        <div class="right-con">
          <evaluation-add-edit-new
            :evaluation-info="curEva"
            @success="onSuccess"
            @updateTitle="onTitleUpdate"></evaluation-add-edit-new>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { listAssessmentData, saveAssessment } from '@apis/mzEvaluation.js'
import EvaluationSearch from '../compnents/EvaluationSearch.vue'
import EvaluationList from '../compnents/EvaluationList.vue'
import EvaluationAddEditNew from './EvaluationAddEditNew'
export default {
  name: 'minZhuCreate',
  components: { EvaluationSearch, EvaluationList, EvaluationAddEditNew },
  props: {},
  data() {
    return {
      statusOptions: [
        {
          label: '全部',
          value: '',
        },
        {
          label: '草稿',
          value: '-2',
        },
        {
          label: '待审核',
          value: '-1',
        },
        {
          label: '审核不通过',
          value: '0',
        },
        {
          label: '未开始',
          value: '1',
        },
        {
          label: '收集中',
          value: '2',
        },
        {
          label: '已结束',
          value: '3',
        },
        // {
        //   label: "已暂停",
        //   value: "4",
        // },
      ],
      selectParams: {
        assessmentStatus: '',
        key: '',
        pageNum: 1,
        pageSize: 10,
      },
      totalSize: 0,
      curEva: {}, // 当前的测评任务
      evaluations: [],
    }
  },
  watch: {},
  computed: {},
  created() {
    const { id = '' } = this.$route.query || {}
    this.getEvaluationList(id)
  },
  mounted() {},
  methods: {
    /* 监听搜索 */
    onSearch(obj) {
      this.selectParams = {
        ...this.selectParams,
        ...obj,
      }
      this.getEvaluationList()
    },

    /* 监听列表页码变化 */
    onPageChange(obj) {
      this.selectParams.pageNum = obj.currentPage
      this.selectParams.pageSize = obj.pageSize
      this.getEvaluationList()
    },

    /* 获取测试任务列表 */
    getEvaluationList(id) {
      listAssessmentData({
        id: id || '',
        ...this.selectParams,
      }).then(res => {
        const { content = [], totalSize = 0 } = res.data || {}
        content.forEach(item => {
          if (item.assessmentStatus === '-2' && item.assessmentTitle.indexOf('（') === -1) {
            item.assessmentTitle = item.assessmentTitle + '（全部）'
          }
        })
        this.evaluations = content
        this.totalSize = totalSize
      })
    },

    /**
     * @function 监听测试任务的创建或者编辑
     * @param {String} type add-新建，edit-编辑
     * @param {Object} task 测试任务
     * @param {Number} n 0-编辑，1-查看详情
     */
    onTask(type, task, n) {
      if (type === 'edit' && task) {
        // this.$router.push({
        //   path: `evaluationCreate?id=${task.id}&activeSteps=${n}`,
        // })
      } else {
        /* 创建测评 */
        saveAssessment({}).then(res => {
          if (res.status === 200) {
            const data = res.data
            if (data.status === 0) {
              this.$message.success(data.tips)
              this.selectParams.pageNum = 1
              this.selectParams.pageSize = 10
              this.getEvaluationList()
            } else {
              this.$message.warning(data.tips)
            }
          }
        })
      }
    },

    /* 监测选中的测评任务 */
    onSelectEva(obj) {
      this.curEva = obj
      this.$router.push({
        name: 'PSKH_MINZHU_ASSESS',
        query: {
          id: obj.id,
        },
      })
    },

    /* 监听测评任务的处理 */
    onSuccess(type) {
      if (['del'].includes(type)) {
        this.selectParams.pageNum = 1
        this.selectParams.pageSize = 10
      }
      this.getEvaluationList()
    },

    onTitleUpdate(str) {
      this.getEvaluationList()
    },
  },
}
</script>
<style lang="scss" scoped>
@import '@styles/layout.scss';
.create {
  height: 100%;
  .content {
    // height: calc(100% - 78px);
    height: calc(100%);
    padding-bottom: 20px;
    display: flex;
    flex-direction: column;
    position: relative;
    .search-box {
      width: 100%;
      margin-bottom: 20px;
    }
    .table-con {
      flex: 1;
      display: flex;
      align-items: stretch;
      height: calc(100% - 50px);
      .left-con {
        width: 25%;
        min-width: 300px;
      }
      .right-con {
        flex: 1;
        margin-left: 25px;
      }
    }
  }
}
</style>
